<template>
  <router-link class="mb-5" :to="{name:'detail',query:{id:blog.BlogId}}">
    <img
      class="img-fluid"
      :src="CoverImage + blog.Cover"
      alt="图片丢失"
    />
    <!-- https://localhost:44358/Image/ -->
    <!-- http://106.55.8.31:8080/Image/ -->
    <!-- '/api/blog/LoadImage?path=Image&name='+ blog.Cover -->
    <!-- <img class="img-fluid" :src="require('../assets/Images/'+blog.cover+'.jpg')" alt /> -->
    <p class="text-center text-wrap">{{ blog.Title }}</p>
  </router-link>
</template>

<script>
import axios from "axios";

export default {
  name: "BlogCardItem",
  props: ["blog","CoverImage"],
  data() {
    return{
      // process:Object
    };
  }
};
</script>

<style scoped>
.item a {
  display: block;
  position: relative;
}
.item a p {
  width: 100%;
  position: absolute;
  bottom: 0;
  margin: 0;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
}
</style>
